<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>仿王者荣耀官方网站-官方爆料</title>
    <link rel="stylesheet" href="../style/reset.css" />
    <link rel="stylesheet" href="../style/common.css" />
    <link rel="stylesheet" href="../style/page/break.css" />
  </head>
  <body>
    <div class="page-break">
      <div class="bg">
        <img src="../img/break/bg.jpg" alt="" />
      </div>
      <div class="bg">
        <img src="../img/break/bg-shadow.png" alt="" />
      </div>
      <div class="left-area">
        <div class="vertical-menu">
          <div class="vertical-menu__title">官方爆料</div>
          <div class="vertical-menu__item active">
            <a href="#" class="btn">最新皮肤</a>
          </div>
          <div class="vertical-menu__item">
            <a href="#" class="btn">最新英雄</a>
          </div>
        </div>
      </div>
      <div class="right-area">
        <div class="person">
          <div>芈月</div>
          <div class="person__skin">瑰影绮梦</div>
          <div class="person__info person__info--w49">
            <span class="person__info__name">品级：</span>
            <span>史诗</span>
          </div>
          <div class="person__info person__info--w49">
            <span class="person__info__name">标签：</span>
            <span>
              <img
                class="img--label"
                src="../img/break/icon-level.png"
                alt="" />
            </span>
          </div>
          <div class="person__info">
            <span class="person__info__name">上线时间：</span>
            <span>2025.02.27</span>
          </div>
          <div class="person__info">
            <span class="person__info__name">获取方式：</span>
            <span>商城直售</span>
          </div>
          <div class="person__video">
            <img src="../img/break/video-cover.png" alt="" />
          </div>
          <div class="person__info">
            <span class="person__info__name"
              >沉醉玫瑰幻境，聆听回忆的交响曲</span
            >
          </div>
          <a href="#" class="person__btn">详情</a>
          <a href="#" class="person__download">下载壁纸</a>
        </div>
      </div>
      <ul class="heros">
        <li class="item active">
          <img src="../img/break/avator-1.jpg" alt="" />
        </li>
        <li class="item">
          <img src="../img/break/avator-2.jpg" alt="" />
        </li>
        <li class="item">
          <img src="../img/break/avator-3.jpg" alt="" />
        </li>
        <li class="item">
          <img src="../img/break/avator-4.jpg" alt="" />
        </li>
        <li class="item item--more">
          <img src="../img/break/avator-more.png" alt="" />
        </li>
      </ul>
      <div class="shortcut">
        <iframe src="./快捷图标.html" style="width: 330px; height: 130px;"></iframe>
    </div>
  </body>
</html>
